<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>支付方式统计图</title>
</head>
<body style="height: 500px; margin:10px 0;">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" th:src="@{/static/echarts/echarts.min.js}"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="application/javascript">
    $.get("/stat/loadPayTypeInportStatJson",function (data) {
        var dom = document.getElementById("container");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        //app.title = '环形图';

        option = {
            title: {
                text: '易卖支付方式统计',
                subtext: '真实有效',
                x: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: data
            },
            series: [
                {
                    name: '支付方式(占比)',
                    type: 'pie',
                    radius: ['50%', '70%'],
                    avoidLabelOverlap: false,
                    label: {
                        normal: {
                            show: false,
                            position: 'center'
                        },
                        emphasis: {
                            show: true,
                            textStyle: {
                                fontSize: '30',
                                fontWeight: 'bold'
                            }
                        }
                    },
                    labelLine: {
                        normal: {
                            show: false
                        }
                    },
                    data: data
                }
            ]
        };

        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    });
</script>
</body>
</html>